<template>
  <div class="component-page">
    <h1 class="user-title">我的资产</h1>
    <div class="convert-box">
      <span class="text">总资产折合：</span>
     123
      <span class="text">(CNY)</span>
    </div>
    <div class="tool-box">
      <div class="too-card">
        <div class="dis-ambo">
          <span class="card-title">币币账户</span>
          <router-link to="/user/cec-record">
            <span class="card-text">
              财务记录
              <i class="el-icon-arrow-right"></i>
            </span>
          </router-link>
        </div>
        <p class="asset-number">
         123
          <span class="text">CNY</span>
        </p>
        <div class="dis-ambo card-dis">
          <router-link to="/user/asset/charge">
            <span class="card-text">
              <i class="iconfont icon-chongzhi"></i>充币
            </span>
          </router-link>
          <router-link to="/exchange">
            <span class="card-text">
              <i class="iconfont icon-jiaoyi1"></i>交易
            </span>
          </router-link> 
        </div>
        <div class="dis-ambo card-dis">
          <router-link to="/user/asset/mention">
            <span class="card-text">
             <i class="iconfont icon-tixian"></i>提币
            </span>
          </router-link>
          <router-link to>
            <span class="card-text">
              <i class="iconfont icon-zijinchihuazhuan"></i>划转
            </span>
          </router-link>
        </div>
      </div>
      <div class="too-card">
        <div class="dis-ambo">
          <span class="card-title">法币账户</span>
          <router-link to="/user/otc-record">
            <span class="card-text">
              财务记录
              <i class="el-icon-arrow-right"></i>
            </span>
          </router-link>
        </div>
        <p class="asset-number">
        123
          <span class="text">CNY</span>
        </p>
        <div class="dis-ambo card-dis">
          <router-link to="/legail">
            <span class="card-text">
              <i class="iconfont icon-jiaoyi1"></i>交易
            </span>
          </router-link>
        </div>
        <div class="dis-ambo card-dis">
          <router-link to="/user/asset/transfer">
            <span class="card-text">
              <i class="iconfont icon-zijinchihuazhuan"></i>转账
            </span>
          </router-link>
        </div>
      </div>
    </div>
    <ul class="hint">
      <li>为保障资金安全，当您账户安全策略变更、密码修改、我们会对提币进行人工审核，请耐心等待工作人员电话或邮件联系。</li>
      <li>请务必确认电脑及浏览器安全，防止信息被篡改或泄露。</li>
    </ul>
  </div>
</template>
<script>
export default {
  data() {
    return {
      asset: {
        CecCoin: "-",
        OtcCoin: "-",
        AllCoin: "-"
      }
    };
  },

  methods: {
    reqAsset() {
      this.axios.post(this.$baseURL + "/asset/myasset").then(res => {
        if (res.data.Code == 200) {
          if (res.data) {
            let data = this.$decryptByDES(res.data.Data);
            data = JSON.parse(data);
            this.asset = data;
          } 
        }
      });
    }
  },

  computed: {},

  created() {
    this.reqAsset();
  },

  mounted() {},
  
};
</script>
<style scoped>
.convert-box {
  line-height: 68px;
  padding-left: 12px;
  color: #333333;
  font-size: 20px;
  font-weight: 500;
}
.convert-box .text {
  color: #999999;
  font-size: 18px;
  font-weight: 400;
}
.tool-box {
  display: flex;
}
.too-card {
  width: 480px;
  height: 355px;
  background-size: 100% 100%;
  padding: 75px 45px 101px 51px;
}
.too-card:nth-of-type(1) {
  background-image: url("../../../../public/img/assent_left.png");
}
.too-card:nth-of-type(2) {
  background-image: url("../../../../public/img/assent_right.png");
}
.dis-ambo {
  display: flex;
  justify-content: space-between;
}
.card-text {
  font-size: 16px;
  color: #31c0ce;
  line-height: 33px;
}
.card-text .iconfont{
  margin-right: 5px;
}
.card-title {
  font-size: 24px;
  font-weight: 500;
  color: rgba(0, 95, 104, 1);
  line-height: 33px;
}
.el-icon-arrow-right {
  font-size: 12px;
  position: relative;
  left: -2px;
}
.asset-number {
  color: #333333;
  font-size: 24px;
  font-weight: 500;
  line-height: 33px;
  margin: 10px 0 36px 0;
}
.asset-number .text {
  color: #999999;
  font-size: 18px;
}
.card-icon {
  width: 14px;
  height: 14px;
  position: relative;
  vertical-align: middle;
  margin-right: 3px;
}
.hint {
  margin-top: 47px;
  padding-left: 20px;
}
.hint li {
  color: #999999;
  font-size: 16px;
  line-height: 22px;
  margin-bottom: 17px;
  list-style: disc;
}
</style>
